{% extends 'base.html' %}
{% block title %}享学博客首页{% endblock %}

{% block content %}

<section class="container">
  <div class="content-wrap">
  <div class="content">

    <!-- banner 开始 -->

    <div id="focusslide" class="carousel slide" data-ride="carousel">
  	<ol class="carousel-indicators">

      {% for banner in banner_list %}
      {% if banner.is_active %}
  	  <li data-target="#focusslide" data-slide-to="{{banner.idx}}" class="active"></li>
      {% else %}
  	  <li data-target="#focusslide" data-slide-to="{{banner.idx}}"></li>
      {% endif %}
      {% endfor %}

  	</ol>

  	<div class="carousel-inner" role="listbox">

      {% for banner in banner_list %}
      {% if banner.is_active %}
        <div class="item active">
        <a href="{{banner.link_url}}" target="_blank" title="{{banner.title}}" >
        <img src="{{banner.cover}}" alt="{{banner.title}}" class="img-responsive"></a>
        </div>
      {% else %}
        <div class="item">
        <a href="{{banner.link_url}}" target="_blank" title="{{banner.title}}" >
        <img src="{{banner.cover}}" alt="{{banner.title}}" class="img-responsive"></a>
        </div>
      {% endif %}
      {% endfor %}


  	</div>
  	<a class="left carousel-control" href="#focusslide" role="button" data-slide="prev" rel="nofollow">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
      <span class="sr-only">上一个</span> </a>
      <a class="right carousel-control" href="#focusslide" role="button" data-slide="next" rel="nofollow">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">下一个</span> </a>
      </div>
      <!-- banner 结束 -->


    <!-- 推荐开始 -->
    {% for post in recommend_list %}
    <article class="excerpt-minic excerpt-minic-index">
  		<h2><span class="red">【推荐】</span><a target="_blank" href="/blog/{{post.id}}" title="{{post.title}}" >{{post.title}}</a>
  		</h2>
  		<p class="note">{{post.content}}</p>
  	</article>
    {% endfor %}
    <!-- 推荐结束 -->


    <div class="title">
  	<h3>最新发布</h3>
  	<div class="more">
      {% for c in blogcategory_list %}
  			<a href="/category/{{c.id}}" title="{{c.name}}" >{{c.name}}</a>
      {% endfor %}
  		</div>
    </div>


    <!-- 最新博客开始 -->
    {% for post in post_list %}
    <!-- .object_list -->
    <article class="excerpt excerpt-1" style="">
    <a class="focus" href="/blog/{{post.id}}" title="{{post.title}}" target="_blank" ><img class="thumb" data-original="/{{post.cover}}" src="/{{post.cover}}" alt="{{post.title}}"  style="display: inline;"></a>
  		<header>
        <a class="cat" href="/category/{{post.category.id}}" title="{{post.category.name}}" >{{post.category.name}}<i></i></a>
  			<h2><a href="/blog/{{post.id}}" title="{{post.title}}" target="_blank" >{{post.title}}</a>
  			</h2>
  		</header>
  		<p class="meta">
  			<time class="time"><i class="glyphicon glyphicon-time"></i>{{post.pub_date}}</time>
  			<span class="views"><i class="glyphicon glyphicon-eye-open"></i>{{post.views}}</span> <a class="comment" href="##comment" title="评论" target="_blank" ><i class="glyphicon glyphicon-comment"></i>{{post.comment_set.count}}</a>
  		</p>
  		<p class="note">{{post.content}}</p>
  	</article>
    {% endfor %}
    <!-- 最新博客结束 -->

    {% include "_pagination.html" %}


  </div>
  </div>
  <aside class="sidebar">
  <div class="fixed">
    <div class="widget widget-tabs">
    	<ul class="nav nav-tabs" role="tablist">
    	  <li role="presentation" class="active"><a href="#notice" aria-controls="notice" role="tab" data-toggle="tab" >统计信息</a></li>
    	  <li role="presentation"><a href="#contact" aria-controls="contact" role="tab" data-toggle="tab" >联系站长</a></li>
    	</ul>
    	<div class="tab-content">
    	  <div role="tabpanel" class="tab-pane contact active" id="notice">
    		<h2>日志总数:
    			  888篇
    		  </h2>
    		  <h2>网站运行:
    		  <span id="sitetime">88天 </span></h2>
    	  </div>
    		<div role="tabpanel" class="tab-pane contact" id="contact">
    		  <h2>QQ:
    			  <a href="" target="_blank" rel="nofollow" data-toggle="tooltip" data-placement="bottom" title=""  data-original-title="QQ:"></a>
    		  </h2>
    		  <h2>Email:
    		  <a href="#" target="_blank" data-toggle="tooltip" rel="nofollow" data-placement="bottom" title=""  data-original-title="#"></a></h2>
    	  </div>
    	</div>
    </div>

    <div class="widget widget_search">

  	<form class="navbar-form" action="/search" method="post">
  	  <div class="input-group">
    		<input type="text" name="keyword" class="form-control" size="35" placeholder="请输入关键字" maxlength="15" autocomplete="off">
    		<span class="input-group-btn">
    		<button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
    		</span>
      </div>
      {% csrf_token %}
  	</form>
    </div>

  </div>
  <div class="widget widget_hot">
  	  <h3>最新评论文章</h3>
  	  <ul>

        {% for c in comment_list %}
  			<li>
          <a title="{{c.post.title}}" href="#" >
            <span class="thumbnail">
      				<img class="thumb" data-original="/{{c.post.cover}}" src="/{{c.post.cover}}" alt="{{c.post.cover}}"  style="display: block;">
      			</span>
            <span class="text">{{c.post.title}}</span>
            <span class="muted"><i class="glyphicon glyphicon-time"></i>
      				{{c.post.pub_date|date:'Y-m-d'}}
      			</span>
            <span class="muted"><i class="glyphicon glyphicon-eye-open"></i>{{c.post.views}}</span>
          </a>
        </li>

        {% endfor %}


  	  </ul>
   </div>

  <div class="widget widget_sentence">
    <h3>友情链接</h3>
    <div class="widget-sentence-link">
      {% for link in links %}
    	<a href="{{link.link}}" title="{{link.title}}" target="_blank">{{link.title}}</a>&nbsp;&nbsp;&nbsp;
      {% endfor %}
    </div>
  </div>
  </aside>
</section>
{% endblock %}
